// 导入base.scss
@import './base.scss';

// scss语法
$highlight-color: #f90;
$basic-border: 1px solid black;
// 混入mixin
  @mixin container {
      width: 1200px;
      background-color: green;
  }

  @mixin clearfix {
      &:after {
          content: "";
          display: table;
          clear: both;
      }
  }

#app {
    background-color: $highlight-color;
    border: $basic-border;

    .container {
        font-size: 30px;
    }
    span {
        color: pink;
        font-size: 20px;
    }
    a {
        text-decoration: none;
        color: $base-color;
        &:hover {
            color: wheat;
            font-size: 50px;
        }
    }
    h2 {
        color: aquamarine;
        font-size: 20px;
    }
        .div {
            width: 200px;
            @include clearfix;
            @include container;
        }
      
}